<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>移动元素</title>
	</head>
	<body>
		<ul id="List1">
			<li>兰花</li>
			<li>桂花</li>
            <li>菊花</li>
		</ul>
		<ul id="List2">
			<li>松树</li>
			<li>柏树</li>
		</ul>
		<button onclick="myFunction()">点击开始移动</button>
		<script>
			function myFunction()
			{
				// 获取“柏树”元素
				var baiShu = document.querySelector('#List2 li:nth-child(2)');
				// 获取“菊花”元素
				var juHua = document.querySelector('#List1 li:nth-child(3)');
				
				// 将“柏树”元素移动到“菊花”元素之后
				if (juHua) {
					juHua.parentNode.insertBefore(baiShu, juHua.nextSibling);
				}
			}
		</script>
	</body>
</html>
